<!--
*  功能描述：合同综合统计
 -->
  <template>
  <div>
    <el-tag style="width: 100%; text-align: left; font-size: 20px"
      >查询项目综合统计</el-tag
    >
    <el-form>
        <el-form-item label="生产部门" prop="D">
        
      <el-select v-model="D" placeholder="请选择" clearable> 
        <el-option
          v-for="item in Depart"
          :key="item.DepId"
          :value="item.DepName"
          :label="item.DepName"
          ></el-option
        ></el-select
      >
     年份: <el-input v-model="Y" clearable placeholder="立项通过数" style="width:400px"></el-input>
      &nbsp;&nbsp;<el-button type="primary" @click="onsubmit">查询</el-button>
      </el-form-item>
      </el-form>
      <el-tag style="width: 100%; text-align: left; font-size: 20px"
      >自定义查询条件</el-tag>
      <el-col :span="24">
        <el-checkbox v-model="cuid">合同目标值</el-checkbox>
        <el-checkbox v-model="cuname">完成合同额</el-checkbox>
        <el-checkbox v-model="cuphone">合同额完成比例</el-checkbox>
      </el-col>
      <el-col :span="24">
        <el-form :inline="true" class="demo-form-inline">
          <v-show v-if="cuid">
            <el-form-item label="合同目标值">
              <el-input v-model="O" clearable placeholder="合同目标值"></el-input>
            </el-form-item>
          </v-show>
          <v-show v-if="cuname">
            <el-form-item label="完成合同额">
              <el-input v-model="R" clearable placeholder="完成合同额"></el-input>
            </el-form-item>
          </v-show>

          <v-show v-if="cuphone">
            <el-form-item label="合同额完成比例">
              <el-input v-model="W" clearable placeholder="合同额完成比例"></el-input>
            </el-form-item>
          </v-show>
          <el-form-item>
            <el-button type="primary" @click="cha">查询</el-button>
            
          </el-form-item>
        </el-form>
      </el-col>


      <el-tag style="width: 100%; text-align: left; font-size: 20px"
      >项目综合统计列表</el-tag
    >
    <div >
      <el-table :data="tabledata" border style="width: 100%">
        <el-table-column prop="D" label="生产部门" >
        </el-table-column>
        <el-table-column prop="Y" label="合同年份" >
        </el-table-column>
        <el-table-column prop="O" label="合同目标值(万元)" >
        </el-table-column>
        <el-table-column prop="R" label="完成合同额(万元)" >
        </el-table-column>
        <el-table-column prop="W" label="完成比例(%)" >
        </el-table-column>
        <el-table-column prop="C" label="收费时间" >
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      Depart:[],
        cuid: false,
      cuname: false,
      cuphone: false,
      tabledata: [],
          D:'',
          Y:'',
      O:'',
      R:'',
      W:'',
    };
  },
  methods: {
    onsubmit(){
      this.ShowCountPro();
    },
      cha(){
          this.ShowCountPro();
      },
    ShowCountPro() {
      this.$http({
        url: "LeadingCockpit/GetContract",
        method: "Get",
        params: {
            D:this.D,
            Y:this.Y,
            O:this.O,
            R:this.R,
            W:this.W,
        }
      }).then((res) => {
        this.tabledata = res.data;
        console.log(res.data);
      });
    },
    DeptXl() {
      this.$http({
        url: "LeadingCockpit/GetDept",
        method: "Get",
      }).then((res) => {
        this.Depart = res.data;
        console.log(this.data);
      });
    },
  },
  created() {
    this.ShowCountPro();
    this.cha();
    this.onsubmit();
    this.DeptXl();
  },
};
</script>